<template>
  <div>
    <!-- 验收复核操作页面 -->
    <el-dialog title="验收复核操作页面"
               :visible.sync="dialogForm"
               width="1200px">
      <el-form :inline="true"
               ref="form"
               :model="form"
               class="add-form"
               label-width="110px">
        <h3>基础信息</h3>
        <hr />
        <el-row>
          <el-col :span="8"
                  class="el-height"><span class="labels">货主:</span>{{form.cargoOwnerName}}</el-col>
          <el-col :span="8"
                  class="el-height"><span class="labels">车船号:</span>{{form.transhipNo}}</el-col>
          <el-col :span="8"
                  class="el-height"><span class="labels">入库方式:</span>{{form.inWayName}}</el-col>
          <el-col :span="8"
                  class="el-height"><span class="labels">运输方式:</span>{{form.transportWay | _filterTransportModeType}}</el-col>
          <el-col :span="8"
                  class="el-height"><span class="labels">品名:</span>{{form.cargoName}}</el-col>
          <el-col :span="8"
                  class="el-height"><span class="labels">规格:</span>{{form.normStr}}</el-col>
          <el-col :span="8"
                  class="el-height"><span class="labels">管理方式:</span>{{form.manageWay | _filterManagement}}</el-col>
          <el-col :span="8"
                  class="el-height"><span class="labels">计量方式:</span>{{form.measureWay | _filterMeterStyle}}</el-col>
          <el-col :span="8"
                  class="el-height"><span class="labels">生产厂家:</span>{{form.madeBy}}</el-col>
          <el-col :span="8"
                  class="el-height"><span class="labels">仓库:</span>{{form.warehouseName}}</el-col>
          <el-col :span="8"
                  class="el-height"><span class="labels">验收件数:</span>{{form.checkAcceptNum}}</el-col>
          <el-col :span="8"
                  class="el-height"><span class="labels">验收重量:</span>{{form.checkAcceptWeight}}</el-col>
          <el-col :span="8"
                  class="el-height"><span class="labels">验收数量:</span>{{form.checkAcceptCount}}{{form.numUnit}}</el-col>
        </el-row>
        <h3>验收明细</h3>
        <hr />
        <el-button class="button"
                   @click="addInfo">附件信息</el-button>
        <el-table :data="form.detailVoList"
                  border
                  :row-class-name="tableRowClassName"
                  @selection-change="handleSelectionChange"
                  max-height="550">
          <el-table-column type="expand"
                           width="30">
            <template slot-scope="props">
              <el-form label-position="left"
                       inline
                       class="demo-table-expand">
                <el-col :span="6"
                        class="table-expand-style">
                  <el-form-item label="净重">
                    <span>{{ props.row.netWeight}}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="6"
                        class="table-expand-style">
                  <el-form-item label="毛重">
                    <span>{{ props.row.grossWeight}}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="6"
                        class="table-expand-style">
                  <el-form-item label="库房">
                    <span>{{ props.row.roomName}}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="6"
                        class="table-expand-style">
                  <el-form-item label="炉批号">
                    <span>{{ props.row.stoveNo}}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="6"
                        class="table-expand-style">
                  <el-form-item label="作业点">
                    <span>{{ props.row.jobPointName}}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="6"
                        class="table-expand-style">
                  <el-form-item label="物资ID">
                    <span>{{ props.row.inventoryId}}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="6"
                        class="table-expand-style">
                  <el-form-item label="验收人">
                    <span>{{ props.row.checkAcceptMan }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="6"
                        class="table-expand-style">
                  <el-form-item label="验收时间">
                    <span>{{ props.row.checkAcceptTime }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="6"
                        class="table-expand-style">
                  <el-form-item label="验收附件信息">
                    <download v-model="props.row.acceptAttachments"></download>
                  </el-form-item>
                </el-col>
                <el-col :span="6"
                        class="table-expand-style">
                  <el-form-item label="验收备注">
                    <span>{{ props.row.remark }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="6"
                        class="table-expand-style">
                  <el-form-item label="复核附件信息">
                    <download v-model="props.row.detailAttachments"></download>
                  </el-form-item>
                </el-col>
                <el-col :span="6"
                        class="table-expand-style">
                  <el-form-item label="复核备注">
                    <span>{{ props.row.failedReason }}</span>
                  </el-form-item>
                </el-col>
              </el-form>
            </template>
          </el-table-column>
          <el-table-column type="selection"
                           width="30"></el-table-column>
          <el-table-column label="序号"
                           type="index"
                           width="50"></el-table-column>
          <el-table-column prop="checkAcceptNo"
                           label="验收单号"
                           min-width="120"></el-table-column>
          <el-table-column prop="transhipNo"
                           label="车船号"
                           min-width="80"></el-table-column>
          <el-table-column prop="trackingNo"
                           label="跟踪号"
                           min-width="80"></el-table-column>
          <el-table-column prop="ifSmall"
                           label="是否小件"
                           min-width="80">
            <template slot-scope="scope">
              {{ scope.row.ifSmall | _filterTrueOrFalse }}
            </template>
          </el-table-column>
          <el-table-column prop="lbsTimes"
                           label="磅次"
                           min-width="80"></el-table-column>
          <el-table-column prop="lbsWeight"
                           label="合磅重量"
                           min-width="80"></el-table-column>
          <el-table-column prop="checkAcceptWeight"
                           label="验收重量"
                           min-width="80"></el-table-column>
          <el-table-column prop="checkAcceptCount"
                           label="数量"
                           min-width="80"></el-table-column>
          <el-table-column prop="tagWeight"
                           label="标牌重量"
                           min-width="80"></el-table-column>
          <el-table-column prop="rulerWeight"
                           label="检尺重量"
                           min-width="80"></el-table-column>
          <el-table-column prop="roomLocation"
                           label="库位"
                           min-width="120"></el-table-column>
          <el-table-column prop="baleNo"
                           label="捆包号"
                           min-width="80"></el-table-column>
          <el-table-column prop="carNumber"
                           label="车牌号"
                           min-width="80"></el-table-column>
        </el-table>
      </el-form>
      <div slot="footer"
           class="dialog-footer">
        <el-button type="primary"
                   @click="recheck">确认复核</el-button>
        <el-button type="primary"
                   @click="reback">退 回</el-button>
        <el-button @click="dialogForm = false">返 回</el-button>
      </div>
    </el-dialog>
    <!-- 附加信息 -->
    <updown-dialog-form ref="updownDialogForm"
                        @load="getUrl"></updown-dialog-form>
  </div>
</template>

<script>
import { checkAcceptanceIn, rebackAcceptanceIn } from '@/api/enter/acceptanceIn'
import updownDialogForm from './updownDialogForm'
import download from '@/components/download'

export default {
  name: 'recheckForm',
  components: { updownDialogForm, download },
  data() {
    return {
      form: {},
      form2: this.clearForm(),
      dialogForm: false,
      data: [],
      multipleSelection: [],
      red:false,
      trackingNos:[]//记录变红的跟踪号
    }
  },
  methods: {
    clearForm() {
      return { checkSonVos: [] }
    },
    handleSelectionChange(val) {
      this.multipleSelection = val
    },
    //点击附件信息按钮
    addInfo() {
      if (this.multipleSelection.length === 0) {
        this.$message({ type: 'error', message: '请至少选择一条数据' })
      } else {
        this.$refs.updownDialogForm.dialogForm = true
      }
    },
    //获取附件信息
    getUrl(val) {
      this.multipleSelection.forEach(element => {
        element.failedReason = val.remark
        element.detailAttachments = val.attachments
      })
    },
    //磅差在千分之三之外，变红
    tableRowClassName({ row, rowIndex }) {
      //计量方式为检斤,验收重量与相应磅秤的吊牌重量之间的磅差超过千分之三，变红
      if (this.form.measureWay === 'WEIGHT') {
        if (
          row.checkAcceptWeight - row.tagWeight > 0.003 ||
          row.tagWeight - row.checkAcceptWeight > 0.003
        ) {
          this.red = true
          this.trackingNos.push(row.trackingNo)//把变红的跟踪号记录下来
          return 'warning-row'
        }
        return ''
      }
    },
    //复核
    recheck() {
      this.form.detailVoList.forEach(element => {
        element.attachments = element.detailAttachments //复核附件信息
      })
      this.form2.checkSonVos.push({
        id: this.form.id,
        detailVos: this.form.detailVoList
      })
      if (this.red) {
        let trackingNos = Array.from(new Set(this.trackingNos)) //数组去重,Array.from将它转为真正的数组
        this.$confirm(
          `跟踪号`+trackingNos+`，磅差在千分之三之外，请确认原因再提交。`,
          '磅差过大确认',
          {
            confirmButtonText: '确定',
            type: 'warning'
          }
        )
          .then(() => {
              this.dialogForm = false
          })
      } else {
        checkAcceptanceIn(this.form2).then(res => {
          this.$message({
            type: 'success',
            message: `复核成功!`
          })
          this.dialogForm = false
          this.$emit('load')
        })
      }
    },
    //退回
    reback() {
      this.$prompt('退回原因', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消'
      })
        .then(({ value }) => {
          rebackAcceptanceIn(this.form.id, { reason: value }).then(res => {
            this.$message({ type: 'success', message: '退回成功' })
            this.dialogForm = false
          })
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '取消输入'
          })
        })
    }
  }
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.el-height {
  margin: 10px 0;
}
h3 {
  margin: 10px 0;
}
.labels {
  margin-right: 5px;
}
.el-table .warning-row {
  background: rgb(236, 8, 8);
}
</style>
